<template>
	<view class="corrigendum ff-font-14 ff-color-000">
		<view class="corrigendum-header ff-font-16 ff-font-weight-600 ff-color-blue">请核实实际消防设施信息</view>
		<view class="corrigendum-header-info ff-padding-15 ff-bg-fff ff-border-radius-10 ff-margin-12">
			<view class="ff-font-16 ff-font-weight-600 ff-margin-bottom-10">{{ corrigendumDetails.buildingName }}</view>
			<view class="ff-font-13 ff-line-height-1-3">{{ corrigendumDetails.buildingAddr }}</view>
		</view>
		<view class="ff-bg-fff ff-margin-12 ff-border-radius-10 ff-padding-10">
			<view class="ff-flex-between ff-relative">
				<view class="corrigendum-content-title ff-font-16 ff-font-weight-600 ff-border-radius-5">建筑物详情</view>
				<view class="corrigendum-content-button" @click="corrigendumBuildingClick">建筑物信息勘误</view>
			</view>
			<view class="corrigendum-content-info ff-margin-top-15 ff-line-height-1-3">
				<view class="corrigendum-content-info-box">
					<view class="ff-flex ff-padding-left-5 ff-margin-bottom-16">
						<view class="corrigendum-content-info-box-left">高度(米)</view>
						<view>{{ corrigendumDetails.buildingHeight }}</view>
					</view>
					<view class="ff-flex ff-padding-left-5 ff-margin-bottom-16">
						<view class="corrigendum-content-info-box-left">面积(m²)</view>
						<view>{{ corrigendumDetails.buildingArea }}</view>
					</view>
					<view class="ff-flex ff-padding-left-5 ff-margin-bottom-16">
						<view class="corrigendum-content-info-box-left">地上层数(层)</view>
						<view>{{ corrigendumDetails.buildingUpLayers }}</view>
					</view>
					<view class="ff-flex ff-padding-left-5">
						<view class="corrigendum-content-info-box-left">地下层数(层)</view>
						<view>{{ corrigendumDetails.buildingDownLayers }}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="corrigendum-content-table" v-if="corrigendumDetails.mainBuildingFacilities">
			<view class="ff-bg-fff ff-padding-10 ff-margin-12 ff-border-radius-10 ff-margin-bottom-10 ff-bg-fff">
				<view class="ff-flex-between ff-relative">
					<view
						class="corrigendum-content-title ff-font-16 ff-font-weight-600 ff-border-radius-5 ff-margin-bottom-15">
						消防设施需求详情</view>
					<view class="corrigendum-content-button" @click="corrigendumFireFacilitiesClick">消防设施设备勘误</view>
				</view>
				<view class="corrigendum-content-tableBox"
					v-for="(item, index) of corrigendumDetails.mainBuildingFacilities" :key="index">
					<view class="ff-font-15 ff-font-weight-600 ff-margin-bottom-18">{{ index + 1 }}.
						{{ item.facilitiesTypeName }}
					</view>
					<view class="corrigendum-content-table-box">
						<view class="ff-flex">
							<view class="table-left-title">设施设备</view>
							<view class="table-right ff-text-center">数量</view>
						</view>
						<view class="ff-flex ff-align-items-one" v-for="(itemClassify, ind) of item.mainFacilitiesItems"
							:key="ind">
							<view class="table-left ff-line-height-1-3">{{ itemClassify.facilitiesItemName }}</view>
							<view class="table-right ff-text-center">{{ itemClassify.number }}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="corrigendum-content-table" v-if="corrigendumDetails.types">
			<view class="ff-bg-fff ff-padding-10 ff-margin-12 ff-border-radius-10 ff-margin-bottom-10 ff-bg-fff">
				<view class="ff-flex-between ff-relative">
					<view
						class="corrigendum-content-title ff-font-16 ff-font-weight-600 ff-border-radius-5 ff-margin-bottom-15">
						消防设施需求详情</view>
					<view class="corrigendum-content-button" @click="corrigendumFireFacilitiesClick">消防设施设备勘误</view>
				</view>
				<view class="corrigendum-content-tableBox" v-for="(item, index) of corrigendumDetails.types"
					:key="index">
					<view class="ff-font-15 ff-font-weight-600 ff-margin-bottom-18">{{ index + 1 }}.
						{{ item.facilitiesTypeName }}
					</view>
					<view class="corrigendum-content-table-box">
						<view class="ff-flex">
							<view class="table-left-title">设施设备</view>
							<view class="table-right ff-text-center">数量</view>
						</view>
						<view class="ff-flex ff-align-items-one" v-for="(itemClassify, ind) of item.items" :key="ind">
							<view class="table-left ff-line-height-1-3">{{ itemClassify.facilitiesItemName }}</view>
							<view class="table-right ff-text-center">{{ itemClassify.number }}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="corrigendum-butList"><u-button type="primary" shape="circle"
				@click="corrigendumSumbit">确认</u-button>
		</view>
		<!-- 弹窗区 -->
		<u-toast ref="uToast" />
		<f-loading ref="loading" />
		<u-modal v-model="corrigendumModel" @confirm="corrigendumConfirm" title="温馨提示" show-cancel-button="true"
			:content-style="{ 'line-height': '1.5' }" :content="corrigendumContent" />
		<u-back-top :scrollTop="scrollTopList.scrollTop" top="200" mode="circle" :iconStyle="scrollTopList.iconStyle"
			:customStyle="scrollTopList.customstyle"></u-back-top>
	</view>
</template>

<script>
	export default {
		name: 'Corrigendum',
		data() {
			return {
				corrigendumModel: false, // 勘误提示弹窗显/隐
				corrigendumContent: '', // 刊物弹窗具体内容
				// 返回顶部组件参数
				scrollTopList: {
					scrollTop: 0,
					iconStyle: {
						fontSize: '32rpx',
						color: '#FFFFFF'
					},
					customstyle: {
						background: '#3B83FE'
					}
				},
				paramsInfo: {
					maintenanceId: '', // 详情页 --维保ID(第一次勘误)
					projectId: '', // 详情页数据ID（第二次勘误）
					type: '' // 跳转页面类型 1第一次勘误还是第二次勘误2
				},
				corrigendumDetails: {}, // 勘误详情数据
				maintenanceBuildingId: '', // 维保状态还是审核报告书状态下的id（维保建筑物id）
				urlDetails: '', // 详情页的url
				urlCorrigendum: '' // 提交勘误的url
			};
		},
		onPageScroll(e) {
			this.scrollTopList.scrollTop = e.scrollTop;
		},
		onShow() {
			this.getCorrigendumDetails(); // 获取建筑物详情页数据
		},
		onLoad(e) {
			// console.log('前页面传过来的数据------', e);
			let paramsInfo = JSON.parse(e.paramsInfo);
			this.paramsInfo = paramsInfo;
			// 第一次勘误---维保前
			if (this.paramsInfo.type == 1) {
				this.urlDetails = `/serviceOrg/maintenance/buildings/${this.paramsInfo.maintenanceId}`;
				this.urlCorrigendum = `/serviceOrg/maintenance/${this.paramsInfo.maintenanceId}/confirm1/buildings`;
				this.getCorrigendumDetails(); // 获取建筑物详情页数据
				return;
			}
			// 第二次，第三次勘误-----维保后
			if (this.paramsInfo.type == 2) {
				this.urlDetails = `/serviceOrg/project/buildings/${this.paramsInfo.projectId}`;
				this.urlCorrigendum = `/serviceOrg/project/${this.paramsInfo.projectId}/confirm/buildingsV2`;
				this.getCorrigendumDetails(); // 获取建筑物详情页数据
				return;
			}
		},
		methods: {
			// 获取建筑物详情页数据
			async getCorrigendumDetails() {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				const data = await this.$http.get({
					url: this.urlDetails
				});
				// console.log('获取建筑物详情页数据-----', data);
				if (data.code == 200) {
					this.corrigendumDetails = data.data[0];
					this.maintenanceBuildingId = this.corrigendumDetails.id;
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 点击去勘误建筑物-------操作
			corrigendumBuildingClick() {
				if (this.paramsInfo.type == 1) {
					let params = {
						maintenanceBuildingId: this.maintenanceBuildingId,
						maintenanceId: this.paramsInfo.maintenanceId,
						type: this.paramsInfo.type
					};
					this.$pageJump.navigateTo(
						'/pages/maintenance/mechanism/home/components/corrigendum/components/corrigendumBuilding?paramsInfo=' +
						JSON.stringify(params));
					return;
				}
				if (this.paramsInfo.type == 2) {
					let params = {
						maintenanceBuildingId: this.maintenanceBuildingId,
						maintenanceId: this.paramsInfo.projectId,
						type: this.paramsInfo.type
					};
					this.$pageJump.navigateTo(
						'/pages/maintenance/mechanism/home/components/corrigendum/components/corrigendumBuilding?paramsInfo=' +
						JSON.stringify(params));
					return;
				}
			},
			// 跳转------勘误消防设施
			corrigendumFireFacilitiesClick() {
				let paramsInfo = {
					maintenanceBuildingId: this.maintenanceBuildingId,
					type: this.paramsInfo.type
				};
				this.$pageJump.navigateTo(
					'/pages/maintenance/mechanism/home/components/corrigendum/components/corrigendumFireFacilities?paramsInfo=' +
					JSON.stringify(paramsInfo));
			},
			// 勘误--------提交
			corrigendumSumbit() {
				if (this.paramsInfo.type == 1) {
					// 维保前-------第一次勘误
					this.corrigendumContent = '请按照建筑物实际消防设施数量准确填写基础数据，若不据实填写，会影响维保执业和生成报告。';
				} else {
					// 维保后------第二次勘误
					this.corrigendumContent = '请按照建筑物实际消防设施数量准确填写基础数据，后期无法再次修改维保数据。';
				}
				this.corrigendumModel = true;
			},
			// 勘误-------确认操作
			corrigendumConfirm() {
				let that = this;
				that.$refs.loading.openLoading('提交中···'); // 打开loading动画
				that.$http.get({
					url: that.urlCorrigendum
				}).then(res => {
					// console.log('勘误-------确认操作返回的结果', res);
					that.$refs.loading.closeLoading(); // 关闭loading动画
					if (res.code == 200) {
						that.$refs.uToast.show({
							title: '保存成功',
							type: 'success'
						});
						setTimeout(() => {
							if (that.paramsInfo.type == 1) {
								// 维保前-------第一次勘误
								that.$pageJump.reLaunch(
									'/pages/maintenance/mechanism/home/components/mechanismWork/mechanismWorking?maintenanceId=' +
									that.paramsInfo.maintenanceId);
							} else if (that.paramsInfo.type == 2) {
								// 维保后------第二次勘误
								that.$pageJump.reLaunch(
									'/pages/maintenance/mechanism/home/components/details/Report?id=' +
									that
									.paramsInfo.maintenanceId);
							}
						}, 500);
					} else {
						uni.showModal({
							title: '温馨提示',
							content: res.msg,
							confirmColor: '#3178FF',
							showCancel: false,
							success: function(res) {
								if (res.confirm) {}
							},
						})
					}
				});
			}
		},
		onShareAppMessage() {
			return {
				title: '分享小程序给朋友',
				path: '/pages/homePage/Home'
			};
		}
	};
</script>

<style lang="scss" scoped>
	.corrigendum {
		&-header {
			margin: 32rpx 24rpx;
		}

		&-content {
			&-button {
				position: absolute;
				right: 0;
				line-height: 1;
				background-color: #f5f8ff;
				border: 2rpx solid #3178ff;
				color: #3178ff;
				padding: 18rpx 22rpx;
				border-radius: 12rpx;
				display: inline-block;
			}

			&-title {
				background: linear-gradient(to right, #eeeeee, #f9f9f9);
				padding: 24rpx 20rpx 20rpx;
				width: 100%;
			}

			&-info {
				&-box {
					&-left {
						width: 29%;
						margin-right: 37rpx;
						color: #a6a6a6;
					}

					&-right {
						width: 64%;
					}
				}
			}

			&-table {
				&-box {
					margin-bottom: 50rpx;

					.ff-flex {
						padding: 24rpx 58rpx;

						.table-left-title {
							width: 70%;
							margin-right: 10%;
						}

						.table-left {
							width: 70%;
							margin-right: 10%;
							color: #5c5f65;
						}

						.table-right {
							flex: 1;
						}
					}
				}
			}

			&-table .ff-flex:nth-child(odd) {
				background-color: #f8f8f8;
			}
		}

		&-butList {
			margin: 0 5%;
			padding: 60rpx 0 100rpx;
			width: 90%;

			/deep/.u-size-default {
				height: 90rpx !important;
				line-height: 90rpx !important;
			}
		}
	}

	.corrigendum-tableBox:last-child .corrigendum-table-box {
		margin-bottom: 0;
	}
</style>
<style lang="scss"></style>